/* Copyright (c) 2016 John Seamons, ZL/KF6VO */

/*****************************/
/* KiwiSDR W3.CSS extensions */
/*****************************/

/* include after w3.css to meet "last one wins" CSS rule */

.w3-navbar a
{
    display: inline-block;
    float: left;
    padding: 8px 16px;
}

.w3-sidenav-full-height a
{
    padding: 8px 2px 8px 16px;
}

.w3-tag2
{
	display: inline-block;
	color: white;
	background-color: black;
	padding: 0.5em 1em;
	margin: 1em 0 0.5em 0;
    text-align: center;
}

.w3-table-fixed
{
	table-layout: fixed;
	empty-cells: show;
	width: 100%;
}

.w3-table-head
{
}

.w3-table-row
{
}

.w3-table-cell
{
	/* next are from html.css for <td>
	padding: 1px;
	vertical-align: middle;*/
}

.w3-colspan-2
{
	colspan: 2;
}

.w3-text
{
    border: none;
    display: inline-block;
    outline: 0;
    padding: 6px 16px;
    vertical-align: middle;
    overflow: hidden;
    text-decoration: none !important;
    color: #fff;
    background-color: #000;
    text-align: left;
    white-space: nowrap;
	cursor: default;
}

.w3-ext-btn
{
    color: black;
    background-color: #f2f2f2;		/* = w3-ext-lighter-gray */
}

.w3-ext-btn:active
{
    color: white;
    background-color: #4CAF50 !important;   /* = w3-selection-green */
    border-color: #4CAF50 !important;       /* = w3-selection-green */
}

/* normalize browser range slider disaster (adapted from www.cssportal.com/style-input-range) */

/* first, turn off all default behavior */
input[type=range] {
  -webkit-appearance: none;
  /*margin: 10px 0;*/
  width: 100%;
  height: 22px;
  background-color: inherit;
  /*background-color: #c0c0c0; /*debug*/
}

input[type=range]:focus {
  outline: none;
}

/* Webkit */
input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 3px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 0px 0px 0px #000000;
  background-color: #808080;
  border-radius: 1px;
  border: 0px solid #000000;
}

input[type=range]::-webkit-slider-thumb {
  box-shadow: 0px 0px 0px #000000;
  border: 1px solid #808080;
  height: 18px;
  width: 18px;
  border-radius: 25px;
  background-color: white;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -7px;
}

input[type=range]:focus::-webkit-slider-runnable-track {
  background-color: #808080;
}

/* Mozilla */
input[type=range]::-moz-range-track {
  width: 100%;
  height: 3px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 0px 0px 0px #000000;
  background-color: #808080;
  border-radius: 1px;
  border: 0px solid #000000;
}

input[type=range]::-moz-range-thumb {
  box-shadow: 0px 0px 0px #000000;
  border: 1px solid #808080;
  height: 16px;		/* has to be smaller than webkit for some reason */
  width: 16px;
  border-radius: 25px;
  background-color: white;
  cursor: pointer;
}

.w3-text-output
{
	display: inline-block;
	background-color: #e6e6e6;
	overflow-x: scroll;
	overflow-y: scroll;
	width: 100%;
	height: 100%;
	padding: 10px;
}

.w3-menu {
    display: inline-block;
    visibility: hidden;
    position: fixed;
    z-index: 1010;          /* see openwebrx.css */
    width: auto;
    margin: auto;
    border-top: 8px solid rgb(240, 240, 240);
    border-bottom: 8px solid rgb(240, 240, 240);
    background-color: rgb(240, 240, 240);
    color: black;
    padding: 0;
    outline: 0;
}

/* OSX menu colors (sort-of) */
.w3-menu-item {
    padding: 4px 16px;      /* instead of margin so :hover inverts color of full width */
    background-color: rgb(240, 240, 240);
}

.w3-menu-item:hover {
    background-color: rgb(79, 157, 251);
    color: white;
}

.w3-menu-item-hr hr {
    background-color: rgb(240, 240, 240);
    border-top: 2px solid rgb(223, 223, 223);
    margin: 5px 0;
}

.w3-debug
{
	border: 1px solid red;		/* debug */
}


/* use with w3_div() to make inline-block */
.w3-inline
{
	display: inline-block;
    vertical-align: bottom;
}


/* attributes to override above */

.w3-show-inline
{
	display: inline;
}

.w3-pointer
{
    cursor: pointer;
}

.w3-static
{
    position: static !important
}

.w3-margin-8
{
    margin: 8px !important
}

.w3-margin-32
{
    margin: 32px !important
}

.w3-margin-LR-8
{
    margin: 0px 8px !important
}

.w3-margin-R-10
{
    margin: 0px 10px 0px 0px !important
}

.w3-margin-LR-16
{
    margin-left: 16px;
    margin-right: 16px;
}

.w3-margin-R-16
{
    margin-right: 16px
}

.w3-margin-T-0
{
    margin-bottom: 0px !important
}

.w3-margin-T-8
{
    margin-top: 8px !important
}

.w3-margin-T-16
{
    margin-top: 16px !important
}

.w3-margin-B-8
{
    margin-bottom: 8px !important
}

.w3-margin-B-10
{
    margin-bottom: 10px !important
}

.w3-margin-B-16
{
    margin-bottom: 16px !important
}

.w3-padding-L-16
{
    padding-left: 16px
}

.w3-padding-LR-8
{
    padding-left: 8px !important;
    padding-right: 8px !important;
}

.w3-padding-TB-8
{
    padding: 8px
}

.w3-vcenter
{
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
}

.w3-hcenter
{
	display: -webkit-flex;
	-webkit-justify-content: center;
	display: flex;
	justify-content: center;
}

.w3-tspace-8:not(:first-child)
{
	margin-top: 8px !important
}

.w3-tspace-16:not(:first-child)
{
	margin-top: 16px !important
}

.w3-hspace-8:not(:first-child)
{
	margin-left: 8px !important
}

.w3-hspace-16:not(:first-child)
{
	margin-left: 16px !important
}

.w3-width-auto
{
	width: auto;
}

.w3-width-32
{
	width: 32px;
}

.w3-width-64
{
	width: 64px;
}

.w3-width-128
{
	width: 128px;
}

.w3-width-zero
{
	width: 0%;
}

.w3-scroll
{
	overflow: scroll;
}

.w3-bold
{
	font-weight: bold;
}


/* declared before w3-visible so w3-visible can override
   when w3-hidden used as inline default ("last one wins" CSS rule) */
.w3-hidden
{
	visibility: hidden;
}

.w3-visible
{
	visibility: visible;
}

/* [class~=word] -> sel all elems with 'class' attribute containing 'word' */

.w3-fade-out
{
	opacity: 0;
	transition: opacity 0.5s linear 1s;
}

.w3-snap-back
{
	opacity: 1;
	transition: opacity 0s linear 0s;
}


.w3-red2, .w3-hover-red2:hover {
    color: white;
    background-color: #fc2929
}

.w3-ext-lighter-gray
{
    color: black;
    background-color: #f2f2f2;	/* gray 95% */
}

.w3-ext-lightGray
{
    color: black;
    background-color: lightGray;
}

.w3-bright-yellow
{
    color: black;
    background-color: yellow
}

.w3-text-bright-yellow
{
    color: #ffff00
}

.w3-override-yellow
{
    color: black;
    background-color: #ffeb3b
}

/* listed last so it overrides others when used as the highlight color in w3_util.js */
.w3-selection-green
{
    color: white;
    background-color: #4CAF50
}

.w3-current
{
    color: white;
    background-color: #999999;	/* gray 60% */
    font-weight: bold;
}

.w3-background-pale-aqua
{
    background-color: #e6ffff;
}

.w3-background-pale-indigo
{
    background-color: #f3ecf9;
}
